<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
	<title>model</title>
	<meta http-equiv="Content-language" content="zh-CN" />
	<link rel="stylesheet" href="./css/ui-lightness/jquery-ui-1.8.10.custom.css" type="text/css" />
	<style type="text/css">
		.clear { clear:both; }
		ul  { margin:0;padding:0; }
		ul li { float:left;width:40px;height:25px;list-style:none;margin:3px;text-align:center;line-height:25px; }
	</style>
</head>
<body>
<div id="page">
	<div>
		<ul class="sortable connectedSortable">
			<li class="ui-state-default">1</li>
			<li class="ui-state-default">2</li>
			<li class="ui-state-default">3</li>
			<li class="ui-state-default">4</li>
			<li class="ui-state-default">5</li>
			<li class="ui-state-default">6</li>
			<li class="ui-state-default">7</li>
		</ul>
		<div class="clear"></div>
	</div>
	<div>
		<ul class="sortable connectedSortable">
			<li class="ui-state-default">1</li>
			<li class="ui-state-default">2</li>
			<li class="ui-state-default">3</li>
			<li class="ui-state-default">4</li>
			<li class="ui-state-default">5</li>
			<li class="ui-state-default">6</li>
			<li class="ui-state-default">7</li>
		</ul>
		<div class="clear"></div>
	</div>
</div><!-- Page end! -->
<script type="text/javascript" src="./js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="./js/jquery-ui-1.8.10.custom.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$( ".sortable" ).sortable({
	placeholder: "ui-state-highlight",
	connectWith: ".connectedSortable"
});
//]]>
</script>
</body>
</html>
